<template>
  <main-wrap>
    <div class="msgListWrap">
      <div class="weui-form-preview mycard">
        <div class="weui-form-preview__hd">
          <div class="weui-form-preview__item">
            <label class="weui-form-preview__label">维修类型</label>
            <em class="weui-form-preview__value aright">{{rtypetext}}</em>
          </div>
        </div>
        <div class="weui-form-preview__bd">
          <div class="weui-form-preview__item">
            <label class="weui-form-preview__label black">地址</label>
            <span class="weui-form-preview__value">{{addrtext}}</span>
          </div>
          <div class="weui-form-preview__item">
            <label class="weui-form-preview__label black">预约时间</label>
            <span class="weui-form-preview__value apptimewrap">{{apptimestr}}</span>
          </div>
          <div class="weui-form-preview__item">
            <label class="weui-form-preview__label black">故障描述</label>
            <span class="weui-form-preview__value">{{order_detail.desc}}</span>
          </div>
          <div class="weui-form-preview__item">
            <label class="weui-form-preview__label black">上传图片</label>
            <div class="weui-form-preview__value">
              <!-- <img v-for="(item, index) of imgs" :key="'i' + index" :src="item" class="imgItem" @click="showimggallery(index)">uploadPreviewWrap
              <video v-for="(item, index) of videos" :key="'v' + index" :src="item" class="videoItem" controls="controls" preload="load"></video> -->
              <!-- <div v-for="(item, index) of attachments" :key="index">
                <img v-if="item.type === 'image'" :src="item.url" class="imgItem" @click="showimggallery">
                <video v-if="item.type === 'video'" :src="item.url" class="videoItem" controls="controls" preload="load"></video>
              </div> -->
              <my-attachments :attachments="order_detail.attachments" :attachtype="'0'"></my-attachments>
            </div>
          </div>
        </div>
        <div class="weui-form-preview__ft">
          <router-link :to="fromurl" class="weui-form-preview__btn weui-form-preview__btn_primary">返回</router-link>
        </div>
      </div>
    </div>

    <!-- <div class="weui-gallery" id="gallery" @click="hideimggallery">
      <span class="weui-gallery__img" id="galleryImg"></span>
    </div> -->
  </main-wrap>
</template>

<script>
import MainWrap from '@/components/mainWrap'
import MyAttachments from '@/components/myattachments'
// import { ImagePreview } from 'vant'
// import 'vant/lib/image-preview/index.css'
import { mapState } from 'vuex'
export default {
  name: 'ReportDetail',
  data () {
    return {
      rtypetext: '',
      addrtext: '',
      // attachments: [],
      // imgs: [],
      // videos: [],
      apptimestr: '',
      fromurl: ''
    }
  },
  components: {
    MainWrap,
    MyAttachments
  },
  computed: {
    ...mapState(['order_detail'])
  },
  mounted () {
    this.cm.overscroll(document.querySelector('.msgListWrap'))

    this.rtypetext = this.cm.getCategoryStr(this.order_detail.labelId)
    this.addrtext = this.cm.getBuildingStr(this.order_detail.buildingId) + this.order_detail.address

    // for (let i = 0; i < this.order_detail.attachments.length; i++) {
    //   const ele = this.order_detail.attachments[i]
    //   let atype = this.cm.getFileType(ele.fileType)
    //   if (atype === 'image') {
    //     this.imgs.push(this.cm.getFullFileUrl(ele.filePath))
    //   } else {
    //     this.videos.push(this.cm.getFullFileUrl(ele.filePath))
    //   }
    // }

    let tarr = this.order_detail.prearrangedTime[0]
    this.apptimestr += tarr.stime1 + '-' + tarr.etime1.substr(11)
    if (tarr.stime2 && tarr.etime2) this.apptimestr += '\n' + tarr.stime2 + '-' + tarr.etime2.substr(11)
    if (tarr.stime3 && tarr.etime3) this.apptimestr += '\n' + tarr.stime3 + '-' + tarr.etime3.substr(11)
  },
  methods: {
    // showimggallery (i) {
    //   ImagePreview({
    //     images: this.imgs,
    //     startPosition: i,
    //     onClose () {
    //       // do something
    //     }
    //   })
    // },
    // showimggallery2 (e) {
    //   document.querySelector('#galleryImg').style.backgroundImage = 'url(' + e.target.getAttribute('src') + ')'
    //   document.querySelector('#gallery').style.display = 'block'
    // },
    // hideimggallery () {
    //   document.querySelector('#gallery').style.display = 'none'
    // }
  },
  beforeRouteEnter (to, from, next) {
    next(vm => {
      vm.fromurl = from.path
    })
  }
}
</script>

<style lang="stylus" scoped>
.weui-form-preview__item
  margin-top 1em

.weui-form-preview__ft
  margin-top .6rem

.apptimewrap
  white-space pre-wrap
</style>
